<template>
  <PageWrapper :title="`用户资料`" contentBackground @back="goBack">
    <template #extra>
      <a-button type="primary" danger> 禁用账号 </a-button>
      <a-button type="primary"> 修改密码 </a-button>
    </template>
    <!-- <template #footer>
             <a-tabs default-active-key="detail" v-model:activeKey="currentKey">
         <a-tab-pane key="detail" tab="用户资料" />
         <a-tab-pane key="logs" tab="操作日志" />
       </a-tabs>
     </template>-->
    <detail-index :user-id="userId" />
    <!--    <div class="pt-4 m-4 desc-wrap">
      <template v-if="currentKey == 'detail'">
        <div v-for="i in 10" :key="i">这是用户{{ nickName }}资料Tab</div>
      </template>
      <template v-if="currentKey == 'logs'">
        <div v-for="i in 10" :key="i">这是用户{{ nickName }}操作日志Tab</div>
      </template>
    </div>-->
  </PageWrapper>
</template>

<script lang="ts" setup>
  import { ref } from 'vue';
  import { useRoute } from 'vue-router';
  import { PageWrapper } from '@/components/Page';
  import { useGo } from '@/hooks/web/usePage';
  import DetailIndex from './detail/index.vue';

  defineOptions({ name: 'AccountDetail' });
  const route = useRoute();
  const go = useGo();
  // 此处可以得到用户ID
  const userId = ref(route.params?.id);
  // 页面左侧点击返回链接时的操作
  function goBack() {
    // 本例的效果时点击返回始终跳转到账号列表页，实际应用时可返回上一页
    go('/system/account');
  }
</script>

<style></style>
